﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>ajax无刷新评论管理</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script src="/js/plugin/jTemplates/jquery-jtemplates.js" type="text/javascript"></script>
    <script type="text/javascript">

        var Foreignkey = 0;
        var RecordCount = 0;
        var CurrentPageIndex = 1;
        var LastPageIndex = 1;
        var PageSize = 5;
        var TemplateUrl = "";
        var TemContainerID = 0;

        function init(_url, _containerid, _Foreignkey, _pagesize) {

            TemplateUrl = _url;
            TemContainerID = _containerid;
            Foreignkey = _Foreignkey
            CurrentPageIndex = 1;

            if (typeof (_pagesize) != undefined)
                PageSize = _pagesize;

            GetList();
            GetCount();

        }

        function GetCount(_OnSuccess) {
            $.ajax({
                type: "POST",
                url: "comment1_api.aspx/GetCommnetCount",
                data: "{'id':'" + Foreignkey + "'}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (msg) {

                    RecordCount = msg.d;
                    LastPageIndex = Math.ceil(RecordCount / PageSize);

                    UpdatePaging();
                }
                , error: function () { alert("GetCount error status:" + arguments[0].status); }
            });
        }

        function GetList(_onSuccess) {

            //$ID=文章ID，$Page=当前页,$PageSize
            $.ajax({
                url: "comment1_api.aspx/GetCommentList",
                data: "{ 'id': '" + Foreignkey + "', 'page': '" + CurrentPageIndex + "','pagesize':'" + PageSize + "' }",
                type: 'POST',
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (msg) {
                    ApplyTemplate(msg);
                    UpdatePaging();
                },
                error: function () { alert("error status:" + arguments[0].status); }
            });
        }

        function ApplyTemplate(data) {
            $('#comment').setTemplateURL(TemplateUrl, null, { filter_data: false });
            $('#comment').processTemplate(data);
        }

        function UpdatePaging() {

            $('#totalRecord').html(CurrentPageIndex + '/' + LastPageIndex);

            if (CurrentPageIndex != 1) {
                $('#PrevPage').attr('href', '#');
                $('#PrevPage').click(PrevPage);
            }
            if (CurrentPageIndex != LastPageIndex) {
                $('#NextPage').attr('href', '#');
                $('#NextPage').click(NextPage);
            }
        }

        function NextPage(evt) {
            evt.preventDefault();
            CurrentPageIndex++;
            GetList();
        }

        function PrevPage(evt) {
            evt.preventDefault();
            CurrentPageIndex--;
            GetList();
        }

        $(document).ready(function () {

            init("template/admincommentlist.htm", "comment", 1, 5);

            $('#ajaxLoading').ajaxStart(function () {
                $(this).show();
            }).ajaxStop(function () {
                $(this).hide();
            });

        });


        function Edit(id, commentreply) {

            if (id < 0) {
                alert("Error ID");
                return false;
            } else if (typeof (commentreply) == undefined) {
                alert("Error commentreply");
                return;
            } else if (commentreply.value == "") {
                alert("Can not be null");
                return;
            }

            $.ajax({
                url: "comment1_api.aspx/commentreply",
                data: "{ 'id': '" + id + "', 'commentreply': '" + commentreply.value + "' }",
                type: 'POST',
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (msg) {
                    //alert(msg.d);
                },
                error: function () { alert("Edit error status:" + arguments[0].status); }
            });

        }

        function Delete() {

            $("[name='deleteid']").each(function () {
                if ($(this).attr("checked"))
                    alert($(this).val());
            });

        }

        function CheckAll() {   //全选
            $("[name='deleteid']").attr("checked", 'true');
        }

        function CheckAll2() {  //反选
            $("[name='deleteid']").each(function () {
                if ($(this).attr("checked"))
                    $(this).removeAttr("checked");
                else
                    $(this).attr("checked", 'true');
            });
        }

    </script>
    <style type="text/css">
        * { margin: 0; padding: 0; }
        .clearleft { clear: left; }
        .template-list a { padding-left: 20px; display: block; line-height: 25px; text-decoration: none; color: #555; }
        .template-list a:hover { background: #F3F3F3; color: #555; }
        .top { background: #444; border-bottom: 4px solid #292929; }
        .top a { float: left; display: block; padding: 5px 10px; text-decoration: none; font: bold 14px Tahoma; color: #eee; }
        .top a:hover { background: #000; color: #e2D784; }
        .top .select { background: #000; color: #e2D784; }
        ul { list-style-type: none; font: normal 12px Tahoma; }
        ul li { padding-left: 10px; line-height: 22px; }
        ol { margin: 10px 20px; }
        ol li { line-height: 22px; }
        .box { margin: 5px; border: 1px solid #eee; }
        .box-title { border-bottom: 4px solid #725D00; font: bold 14px Tahoma; line-height: 28px; padding-left: 10px; color: #725D00; }
        .box-body { font: normal 12px Tahoma; line-height: 28px; color: #2F411B; }
        .box-list { font: normal 12px Tahoma; line-height: 28px; color: #2F411B; }
        .box-list a { display: block; padding: 6px 12px; text-align: center; text-decoration: none; font: bold 14px Tahoma; color: #555; }
        .box-list a:hover { background: #EFEEE1; color: #000; }
        .box-list .select { background: #EFEEE1; color: #000; }
        .focus { padding: 3px; font-family: Tahoma, Verdana, Sans-Serif; font-size: 14px; border: 1px solid #B2D4E8; background: #FFF; color: #0178D9; }
        .blur { padding: 3px; font-family: tahoma, Verdana, Sans-Serif; font-size: 14px; border: 1px solid #ddd; background: #fff; color: #000; }
        .put { padding: 2px 4px; border: 1px solid #CDCCB4; background: #EFEEE1; color: #767648; }
        .pagenav { padding: 3px; margin: 1px 20px; text-align: left; }
        .pagenav A { float: left; display: block; border: 1px solid #D5D5D5; background: #F7F7F7; font: normal 10px Arial; padding: 3px 6px; margin-right: 2px; text-decoration: none; color: #999; }
        .pagenav A:hover { color: #008000; border: 1px solid #ABCD3A; background: #F2FDDB; }
        .pagenav span.current { float: left; display: block; font: bold 10px Arial; padding: 3px 6px; margin-right: 2px; border: 1px solid #E8DB97; background: #FFFFDD; color: #AE1B0D; }
        .pagenav span.info { float: left; display: block; border: 1px solid #D5D5D5; background: #F7F7F7; padding: 3px 6px; margin-right: 2px; color: #999; font: normal 10px Arial; }
        .comment { color: #999; }
        ul.list { padding: 0; list-style-type: none; }
        ul.list li { position: relative; padding-left: 25px; font: normal 12px tahoma; /*height: 25px;*/ line-height: 25px; border-bottom: 1px solid #E3E6EB; }
        ul.list li input { position: absolute; margin: 0; padding: 0; left: 8px; top: 5px; width: 13px; height: 13px; }
        ul.list li span { position: absolute; right: 10px; top: 5px; font: normal 10px tahoma; }
        ul.list li a { text-decoration: none; color: #222; }
        ul.list li a:hover { color: #000; }
        ul.list .onmouseover { background: #F3F3F3; }
        ul.list .onmouseout { background: #fff; }
        
        #ajaxLoading { z-index:9999; position: absolute; bottom: 0px; left: 0px; color: Red; background-color: Yellow; width: 80px; height: 25px; line-height: 25px; }
    </style>
</head>
<body>
    <div id="ajaxLoading">
        Loading...
    </div>
    <div id="comment">
        <img src="css/img01/Wait.gif" title="数据载入中..." alt="" />
    </div>
    <div>
    </div>
</body>
</html>
